{% from "shuup/admin/macros/general.jinja" import content_block %}
{% set var_form = form["variables"] %}

{% call content_block(_("Variables"), "fa-clone", id="variables-section") %}
    <div id="variation-variable-editor"></div>
    {{ var_form["data"]|safe }}
    <div class="product-variable">
    <h3>{% trans %}Template{% endtrans %}</h3>
    {{ bs3.field(var_form["activate_template"]) }}
    </div>
    {% block post_content %}
    <div class="shuup-modal-bg" id="step-item-wrapper" style="display: none;">

        <div class="template-modal-container">
            <div class="template-modal-header">
                <h2 class="pull-left">{% trans %}New template{% endtrans %}</h2>
                <button class="btn btn-danger pull-right" type="button" id="template-cancel-btn">
                    <i class="fa fa-times-circle"></i>
                    {% trans %} Cancel {% endtrans %}
                </button>
            </div>

            <div class="template-form-wrapper">
            <form method="POST" id="template_name" action="/#variables-section">
                {{ bs3.field(var_form["template_name"]) }}
                <input type="submit" placeholder="Save" id="save_template_name" class="btn btn-success" value="Save">
                <br>
            </form>
            </div>

        </div>
        </div>
    </div>
    {% endblock %}
    <script>
    window.addEventListener("load", function() {
        VariationVariableEditor.init({{ var_form.get_editor_args()|json }});
    }, false);

    </script>


{% endcall %}
